ProfessionalWiki / Bootstrap

  * Bootstrap dropdown.js v4.6.0 (https://getbootstrap.com/)

  * Copyright 2011-2021 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)

  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)

  */

(function (global, factory) {

  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('popper.js'), require('./util.js')) :

}(this, (function ($, Popper, Util) { 'use strict';

  var $__default = /*#__PURE__*/_interopDefaultLegacy($);

  var Popper__default = /*#__PURE__*/_interopDefaultLegacy(Popper);

  var Util__default = /*#__PURE__*/_interopDefaultLegacy(Util);

  function _defineProperties(target, props) {

    for (var i = 0; i < props.length; i++) {

      var descriptor = props[i];

      descriptor.enumerable = descriptor.enumerable || false;

      descriptor.configurable = true;

      Object.defineProperty(target, descriptor.key, descriptor);

    }

  }

  function _createClass(Constructor, protoProps, staticProps) {

    return Constructor;

  }

  function _extends() {

      for (var i = 1; i < arguments.length; i++) {

        var source = arguments[i];

          if (Object.prototype.hasOwnProperty.call(source, key)) {

            target[key] = source[key];

          }

        }

      }

      return target;

    };

    return _extends.apply(this, arguments);

  }

  /**

   * ------------------------------------------------------------------------

   * Constants

   * ------------------------------------------------------------------------

   */

  var NAME = 'dropdown';

  var VERSION = '4.6.0';

  var DATA_KEY = 'bs.dropdown';

  var EVENT_KEY = "." + DATA_KEY;

  var DATA_API_KEY = '.data-api';

  var JQUERY_NO_CONFLICT = $__default['default'].fn[NAME];

  var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key

  var SPACE_KEYCODE = 32; // KeyboardEvent.which value for space key

  var TAB_KEYCODE = 9; // KeyboardEvent.which value for tab key

  var ARROW_UP_KEYCODE = 38; // KeyboardEvent.which value for up arrow key

  var ARROW_DOWN_KEYCODE = 40; // KeyboardEvent.which value for down arrow key

  var RIGHT_MOUSE_BUTTON_WHICH = 3; // MouseEvent.which value for the right button (assuming a right-handed mouse)

  var REGEXP_KEYDOWN = new RegExp(ARROW_UP_KEYCODE + "|" + ARROW_DOWN_KEYCODE + "|" + ESCAPE_KEYCODE);

  var EVENT_HIDE = "hide" + EVENT_KEY;

  var EVENT_HIDDEN = "hidden" + EVENT_KEY;

  var EVENT_SHOW = "show" + EVENT_KEY;

  var EVENT_SHOWN = "shown" + EVENT_KEY;

  var EVENT_CLICK = "click" + EVENT_KEY;

  var EVENT_CLICK_DATA_API = "click" + EVENT_KEY + DATA_API_KEY;

  var EVENT_KEYDOWN_DATA_API = "keydown" + EVENT_KEY + DATA_API_KEY;

  var EVENT_KEYUP_DATA_API = "keyup" + EVENT_KEY + DATA_API_KEY;

  var CLASS_NAME_DISABLED = 'disabled';

  var CLASS_NAME_SHOW = 'show';

  var CLASS_NAME_DROPUP = 'dropup';

  var CLASS_NAME_DROPRIGHT = 'dropright';

  var CLASS_NAME_DROPLEFT = 'dropleft';

  var CLASS_NAME_MENURIGHT = 'dropdown-menu-right';

  var CLASS_NAME_POSITION_STATIC = 'position-static';

  var SELECTOR_DATA_TOGGLE = '[data-toggle="dropdown"]';

  var SELECTOR_FORM_CHILD = '.dropdown form';

  var SELECTOR_MENU = '.dropdown-menu';

  var SELECTOR_NAVBAR_NAV = '.navbar-nav';

  var SELECTOR_VISIBLE_ITEMS = '.dropdown-menu .dropdown-item:not(.disabled):not(:disabled)';

  var PLACEMENT_TOP = 'top-start';

  var PLACEMENT_TOPEND = 'top-end';

  var PLACEMENT_BOTTOM = 'bottom-start';

  var PLACEMENT_BOTTOMEND = 'bottom-end';

  var PLACEMENT_RIGHT = 'right-start';

  var PLACEMENT_LEFT = 'left-start';

  var Default = {

    offset: 0,

    flip: true,

    boundary: 'scrollParent',

    reference: 'toggle',

    display: 'dynamic',

    popperConfig: null

  };

  var DefaultType = {

    offset: '(number|string|function)',

    flip: 'boolean',

    boundary: '(string|element)',

    reference: '(string|element)',

    display: 'string',

    popperConfig: '(null|object)'

  };

  /**

   * ------------------------------------------------------------------------

   * Class Definition

   * ------------------------------------------------------------------------

   */

  var Dropdown = /*#__PURE__*/function () {

    function Dropdown(element, config) {

      this._element = element;

      this._popper = null;

      this._config = this._getConfig(config);

      this._menu = this._getMenuElement();

      this._inNavbar = this._detectNavbar();

      this._addEventListeners();

    } // Getters

    var _proto = Dropdown.prototype;

    // Public

    _proto.toggle = function toggle() {

      if (this._element.disabled || $__default['default'](this._element).hasClass(CLASS_NAME_DISABLED)) {

        return;

      }

      var isActive = $__default['default'](this._menu).hasClass(CLASS_NAME_SHOW);

      Dropdown._clearMenus();

      if (isActive) {

        return;

      }

      this.show(true);

    };

    _proto.show = function show(usePopper) {

        usePopper = false;

      }

      if (this._element.disabled || $__default['default'](this._element).hasClass(CLASS_NAME_DISABLED) || $__default['default'](this._menu).hasClass(CLASS_NAME_SHOW)) {

        return;

      }

      var relatedTarget = {

        relatedTarget: this._element

      };

      var showEvent = $__default['default'].Event(EVENT_SHOW, relatedTarget);

      var parent = Dropdown._getParentFromElement(this._element);

      $__default['default'](parent).trigger(showEvent);

      if (showEvent.isDefaultPrevented()) {

        return;

      } // Totally disable Popper for Dropdowns in Navbar

      if (!this._inNavbar && usePopper) {

        /**

         * Check for Popper dependency

         * Popper - https://popper.js.org

         */

        if (typeof Popper__default['default'] === 'undefined') {

          throw new TypeError('Bootstrap\'s dropdowns require Popper (https://popper.js.org)');

        }

        var referenceElement = this._element;

        if (this._config.reference === 'parent') {

          referenceElement = parent;

        } else if (Util__default['default'].isElement(this._config.reference)) {

          referenceElement = this._config.reference; // Check if it's jQuery element

          if (typeof this._config.reference.jquery !== 'undefined') {

            referenceElement = this._config.reference[0];

          }

        } // If boundary is not `scrollParent`, then set position to `static`

        // to allow the menu to "escape" the scroll parent's boundaries

        // https://github.com/twbs/bootstrap/issues/24251

        if (this._config.boundary !== 'scrollParent') {

          $__default['default'](parent).addClass(CLASS_NAME_POSITION_STATIC);

        }

        this._popper = new Popper__default['default'](referenceElement, this._menu, this._getPopperConfig());

      } // If this is a touch-enabled device we add extra

      // empty mouseover listeners to the body's immediate children;

      // only needed because of broken event delegation on iOS

      // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html

      if ('ontouchstart' in document.documentElement && $__default['default'](parent).closest(SELECTOR_NAVBAR_NAV).length === 0) {

        $__default['default'](document.body).children().on('mouseover', null, $__default['default'].noop);

      }

      this._element.focus();

      this._element.setAttribute('aria-expanded', true);

      $__default['default'](this._menu).toggleClass(CLASS_NAME_SHOW);

      $__default['default'](parent).toggleClass(CLASS_NAME_SHOW).trigger($__default['default'].Event(EVENT_SHOWN, relatedTarget));

    };

    _proto.hide = function hide() {

      if (this._element.disabled || $__default['default'](this._element).hasClass(CLASS_NAME_DISABLED) || !$__default['default'](this._menu).hasClass(CLASS_NAME_SHOW)) {

        return;

      }

      var relatedTarget = {

        relatedTarget: this._element

      };

      var hideEvent = $__default['default'].Event(EVENT_HIDE, relatedTarget);

      var parent = Dropdown._getParentFromElement(this._element);

      $__default['default'](parent).trigger(hideEvent);

      if (hideEvent.isDefaultPrevented()) {

        return;

      }

      if (this._popper) {

        this._popper.destroy();

      }

      $__default['default'](this._menu).toggleClass(CLASS_NAME_SHOW);

      $__default['default'](parent).toggleClass(CLASS_NAME_SHOW).trigger($__default['default'].Event(EVENT_HIDDEN, relatedTarget));

    };

    _proto.dispose = function dispose() {

      $__default['default'].removeData(this._element, DATA_KEY);

      $__default['default'](this._element).off(EVENT_KEY);

      this._element = null;

      this._menu = null;

      if (this._popper !== null) {

        this._popper.destroy();

        this._popper = null;

      }

    };

    _proto.update = function update() {

      this._inNavbar = this._detectNavbar();

      if (this._popper !== null) {

        this._popper.scheduleUpdate();

      }

    } // Private

    ;

    _proto._addEventListeners = function _addEventListeners() {

      var _this = this;

      $__default['default'](this._element).on(EVENT_CLICK, function (event) {

        event.preventDefault();

        event.stopPropagation();

        _this.toggle();

      });

    };

    _proto._getConfig = function _getConfig(config) {

      config = _extends({}, this.constructor.Default, $__default['default'](this._element).data(), config);

      Util__default['default'].typeCheckConfig(NAME, config, this.constructor.DefaultType);

      return config;

    };

    _proto._getMenuElement = function _getMenuElement() {

      if (!this._menu) {

        var parent = Dropdown._getParentFromElement(this._element);

        if (parent) {

          this._menu = parent.querySelector(SELECTOR_MENU);

        }

      }

      return this._menu;

    };

    _proto._getPlacement = function _getPlacement() {

      var $parentDropdown = $__default['default'](this._element.parentNode);

      var placement = PLACEMENT_BOTTOM; // Handle dropup

      if ($parentDropdown.hasClass(CLASS_NAME_DROPUP)) {

        placement = $__default['default'](this._menu).hasClass(CLASS_NAME_MENURIGHT) ? PLACEMENT_TOPEND : PLACEMENT_TOP;

      } else if ($parentDropdown.hasClass(CLASS_NAME_DROPRIGHT)) {

        placement = PLACEMENT_RIGHT;

      } else if ($parentDropdown.hasClass(CLASS_NAME_DROPLEFT)) {

        placement = PLACEMENT_LEFT;

      } else if ($__default['default'](this._menu).hasClass(CLASS_NAME_MENURIGHT)) {

        placement = PLACEMENT_BOTTOMEND;

      }

      return placement;

    };

    _proto._detectNavbar = function _detectNavbar() {

      return $__default['default'](this._element).closest('.navbar').length > 0;

    };

    _proto._getOffset = function _getOffset() {

      var _this2 = this;

      var offset = {};

      if (typeof this._config.offset === 'function') {

        offset.fn = function (data) {

          data.offsets = _extends({}, data.offsets, _this2._config.offset(data.offsets, _this2._element) || {});

          return data;

        };

      } else {

        offset.offset = this._config.offset;

      }

      return offset;

    };

    _proto._getPopperConfig = function _getPopperConfig() {

      var popperConfig = {

        placement: this._getPlacement(),

        modifiers: {

          offset: this._getOffset(),

          flip: {

            enabled: this._config.flip

          },

          preventOverflow: {

            boundariesElement: this._config.boundary

          }

        }

      }; // Disable Popper if we have a static display

      if (this._config.display === 'static') {

        popperConfig.modifiers.applyStyle = {

          enabled: false

        };

      }

      return _extends({}, popperConfig, this._config.popperConfig);

    } // Static

    ;

      return this.each(function () {

        var data = $__default['default'](this).data(DATA_KEY);

        var _config = typeof config === 'object' ? config : null;

        if (!data) {

          data = new Dropdown(this, _config);

          $__default['default'](this).data(DATA_KEY, data);

        }

        if (typeof config === 'string') {

          if (typeof data[config] === 'undefined') {

            throw new TypeError("No method named \"" + config + "\"");

          }

          data[config]();

        }

      });

    };

    Dropdown._clearMenus = function _clearMenus(event) {

      if (event && (event.which === RIGHT_MOUSE_BUTTON_WHICH || event.type === 'keyup' && event.which !== TAB_KEYCODE)) {

        return;

      }

      var toggles = [].slice.call(document.querySelectorAll(SELECTOR_DATA_TOGGLE));

      for (var i = 0, len = toggles.length; i < len; i++) {

        var parent = Dropdown._getParentFromElement(toggles[i]);

        var context = $__default['default'](toggles[i]).data(DATA_KEY);

        var relatedTarget = {

          relatedTarget: toggles[i]

        };

        if (event && event.type === 'click') {

          relatedTarget.clickEvent = event;

        }

        if (!context) {

          continue;

        }

        var dropdownMenu = context._menu;

        if (!$__default['default'](parent).hasClass(CLASS_NAME_SHOW)) {

          continue;

        }

        if (event && (event.type === 'click' && /input|textarea/i.test(event.target.tagName) || event.type === 'keyup' && event.which === TAB_KEYCODE) && $__default['default'].contains(parent, event.target)) {

          continue;

        }

        var hideEvent = $__default['default'].Event(EVENT_HIDE, relatedTarget);

        $__default['default'](parent).trigger(hideEvent);

        if (hideEvent.isDefaultPrevented()) {

          continue;

        } // If this is a touch-enabled device we remove the extra

        // empty mouseover listeners we added for iOS support

        if ('ontouchstart' in document.documentElement) {

          $__default['default'](document.body).children().off('mouseover', null, $__default['default'].noop);

        }

        toggles[i].setAttribute('aria-expanded', 'false');

        if (context._popper) {

          context._popper.destroy();

        }

        $__default['default'](dropdownMenu).removeClass(CLASS_NAME_SHOW);

        $__default['default'](parent).removeClass(CLASS_NAME_SHOW).trigger($__default['default'].Event(EVENT_HIDDEN, relatedTarget));

      }

    };

    Dropdown._getParentFromElement = function _getParentFromElement(element) {

      var parent;

      var selector = Util__default['default'].getSelectorFromElement(element);

      if (selector) {

        parent = document.querySelector(selector);

      }

      return parent || element.parentNode;

    } // eslint-disable-next-line complexity

    ;

    Dropdown._dataApiKeydownHandler = function _dataApiKeydownHandler(event) {

      // If not input/textarea:

      //  - And not a key in REGEXP_KEYDOWN => not a dropdown command

      // If input/textarea:

      //  - If space key => not a dropdown command

      //  - If key is other than escape

      //    - If key is not up or down => not a dropdown command

      //    - If trigger inside the menu => not a dropdown command

      if (/input|textarea/i.test(event.target.tagName) ? event.which === SPACE_KEYCODE || event.which !== ESCAPE_KEYCODE && (event.which !== ARROW_DOWN_KEYCODE && event.which !== ARROW_UP_KEYCODE || $__default['default'](event.target).closest(SELECTOR_MENU).length) : !REGEXP_KEYDOWN.test(event.which)) {

        return;

      }

      if (this.disabled || $__default['default'](this).hasClass(CLASS_NAME_DISABLED)) {

        return;

      }

      var parent = Dropdown._getParentFromElement(this);

      var isActive = $__default['default'](parent).hasClass(CLASS_NAME_SHOW);

      if (!isActive && event.which === ESCAPE_KEYCODE) {

        return;

      }

      event.preventDefault();

      event.stopPropagation();

      if (!isActive || event.which === ESCAPE_KEYCODE || event.which === SPACE_KEYCODE) {

        if (event.which === ESCAPE_KEYCODE) {

          $__default['default'](parent.querySelector(SELECTOR_DATA_TOGGLE)).trigger('focus');

        }

        $__default['default'](this).trigger('click');

        return;

      }

      var items = [].slice.call(parent.querySelectorAll(SELECTOR_VISIBLE_ITEMS)).filter(function (item) {

        return $__default['default'](item).is(':visible');

      });

      if (items.length === 0) {

        return;

      }

      var index = items.indexOf(event.target);

      if (event.which === ARROW_UP_KEYCODE && index > 0) {

        // Up

        index--;

      }

      if (event.which === ARROW_DOWN_KEYCODE && index < items.length - 1) {

        // Down

        index++;

      }

      if (index < 0) {

        index = 0;

      }

      items[index].focus();

    };

    _createClass(Dropdown, null, [{

      key: "VERSION",

      get: function get() {

        return VERSION;

      }

    }, {

      key: "Default",

      get: function get() {

        return Default;

      }

    }, {

      key: "DefaultType",

      get: function get() {

        return DefaultType;

      }

    }]);

    return Dropdown;

  }();

  /**

   * ------------------------------------------------------------------------

   * Data Api implementation

   * ------------------------------------------------------------------------

   */

  $__default['default'](document).on(EVENT_KEYDOWN_DATA_API, SELECTOR_DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(EVENT_KEYDOWN_DATA_API, SELECTOR_MENU, Dropdown._dataApiKeydownHandler).on(EVENT_CLICK_DATA_API + " " + EVENT_KEYUP_DATA_API, Dropdown._clearMenus).on(EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {

    event.preventDefault();

    event.stopPropagation();

    Dropdown._jQueryInterface.call($__default['default'](this), 'toggle');

  }).on(EVENT_CLICK_DATA_API, SELECTOR_FORM_CHILD, function (e) {

    e.stopPropagation();

  });

  /**

   * ------------------------------------------------------------------------

   * jQuery

   * ------------------------------------------------------------------------

   */

  $__default['default'].fn[NAME] = Dropdown._jQueryInterface;

  $__default['default'].fn[NAME].Constructor = Dropdown;

  $__default['default'].fn[NAME].noConflict = function () {

    $__default['default'].fn[NAME] = JQUERY_NO_CONFLICT;

    return Dropdown._jQueryInterface;

  };

  return Dropdown;

})));

//# sourceMappingURL=dropdown.js.map